<template>
  <!-- 添加消息通知 -->
  <div class="dialog-container new-detail-dialog">
    <el-dialog
      title="消息通知信息"
      :visible="dialogVisible"
      width="80%"
      @open="initData"
      @close="closeDialog"
    >
      <el-row>
        <el-col :span="24" class="title">
          <h2>{{ dataForm.informationName }}</h2>
        </el-col>
        <el-col :span="24" class="sub-title">
          <h4>{{ dataForm.informationType }}</h4>
          <h4>{{ parseTime(dataForm.createTime,'{y}-{m}-{d}') }}</h4>
        </el-col>
        <el-col :span="24" class="content">
          <div v-html="dataForm.informationContent" />
        </el-col>
      </el-row>
    </el-dialog>

  </div>
</template>

<script>
import { parseTime } from '@/utils/index'
export default {
  name: 'NewsPanel',
  components: {
  },
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    dialogType: {
      type: String,
      default: 'add'
    },
    obj: {
      type: Object,
      default: () => {}
    },
    lawId: {
      type: Number,
      default: null
    }
  },
  data() {
    return {
      saveLoading: false,
      dataForm: {
        id: '',
        informationName: '', // 消息通知名称
        informationType: '', // 消息通知类型
        createTime: '', // 日期
        informationContent: '', // 消息通知内容
        informationSort: '' // 消息通知排序号
      },
      lawsList: []
    }
  },
  created() {
  },
  methods: {
    parseTime,
    initData() {
      this.saveLoading = false
      if (this.obj) {
        this.dataForm = JSON.parse(JSON.stringify(this.obj))
      }
    },
    closeDialog() {
      this.$emit('closeDialog')
      this.clearData()
    },
    clearData() {
      this.dataForm = {
        id: '',
        informationName: '', // 消息通知名称
        informationType: '', // 消息通知类型
        createTime: '', // 日期
        informationContent: '', // 消息通知内容
        informationSort: '' // 消息通知排序号
      }
    }
  }
}
</script>

<style lang="scss" >
.new-detail-dialog{
  .el-dialog{
    margin-top: 70px !important;
  }
  .el-dialog__body{
    height: calc(100vh - 184px);
    overflow: auto;
  }
  .title{
    text-align: center;
    h2{
      margin-bottom: 5px;
    }
  }
  .sub-title{
    text-align: center;
    h4{
      display: inline-block;
      margin: 0px;
      margin-bottom: 10px;
      margin-left: 10px;
    }
  }
  .content{
    *{
      max-width: 100%;
    }
  }
}
</style>
